// #ifdef VUE2
import Vue from 'vue'
// #endif
// #ifdef VUE3
import {
	reactive,
} from 'vue'
// #endif

export default {
	name: 'dark-light',
	title: '暗光',
	config: {
		props: {

		},
	},
	callback: null,
	created: function() {
		this.onDarkChange()
		this.callback = ({
			theme
		}) => {
			this.onDarkChange()
		}
		uni.onThemeChange(this.callback)
	},
	unmounted: function() {
		uni.offThemeChange(this.callback)
	},
	onDarkChange() {
		if (uni.getSystemInfoSync().theme == "dark") {
			this.title = '(暗) 暗光'
			this.config.colors.primary.main = '#666'
			this.config.colors.content.main = '#fff'
			this.config.colors['window-background'] = "#000"
			this.config.colors['window-title-background'] = "#1C1C1C"
			this.config.colors['popup-background'] = "#666"
			// #ifdef VUE2
			Vue.set(this.config.props, 'ff-cell-group', {
				bgColor: '#1C1C1C',
				borderColor: 'rgb(79 79 79)',
			})
			// #endif
			// #ifdef VUE3
			this.config.props['ff-cell-group'] = {
				bgColor: '#1C1C1C',
				borderColor: 'rgb(79 79 79)',
			}
			// #endif
		} else {
			this.title = '(光) 暗光'
			this.config.colors.primary.main = '#2979ff'
			this.config.colors.content.main = '#000'
			this.config.colors['window-background'] = "rgb(243, 244, 246)"
			this.config.colors['window-title-background'] = "rgb(255 255 255 / 90%)"
			this.config.colors['popup-background'] = "aliceblue"
			// #ifdef VUE2
			Vue.set(this.config.props, 'ff-cell-group', {
				bgColor: '#ffffff',
				borderColor: 'rgb(239 239 239)',
			})
			// #endif
			// #ifdef VUE3
			this.config.props['ff-cell-group'] = {
				bgColor: '#ffffff',
				borderColor: 'rgb(239 239 239)',
			}
			// #endif
		}
	},
}